<template>
	<app-layout>
		<view class="mine tn-safe-area-inset-bottom">
			<!-- 顶部自定义导航 -->
			<tn-nav-bar>体检录入</tn-nav-bar>
			<view class="about__wrap" :style="{paddingTop: vuex_custom_bar_height + 'px'}">

				<view class=" tn-padding-bottom-xl tn-bg-white">
					<block>
						<!-- 体检信息  编辑-->
						<view class="tn-padding ">
							<tn-form :labelWidth="150" :model="form" ref="uForm" :errorType="['message']">
								
								<!-- 并增加毛发编号（mfid）、姓名(username)、管控乡镇(gsxz)、管控社工（gssg）的显示（待体检提交和待上传结果都要）。 -->
								<tn-form-item label="姓名" prop="xdusername">
									{{xduser.username}}
								</tn-form-item>
								<tn-form-item label="毛发编号" prop="xdusername">
									{{xduser.mfid}}
								</tn-form-item>
								<tn-form-item label="管控乡镇" prop="xdusername">
									{{xduser.gsxz}}
								</tn-form-item>
								<tn-form-item label="管控社工" prop="xdusername">
									{{xduser.gssg}}
								</tn-form-item>
								
								<tn-form-item label="体检时间" prop="tijiantime" :required="true">
									<tn-input v-model="form.tijiantime" type="select" :selectOpen="tztimeshow"
										placeholder='选择体检时间' @click="tztimeshow = true" />
									<tn-calendar :safeAreaInsetBottom="!!1" :toolTips="`请选择体检时间`" v-model="tztimeshow"
										:changeYear="false" mode="date" @change="tzselect"></tn-calendar>
								</tn-form-item>
								<tn-form-item label="问卷" prop="questionnaire" :required="true">
									<view @click="showloading">
										<tn-image-upload :formData="formData" :action="action" @on-error="uperror"
											uploadText="拍照上传" :isdd="isdd" :autoUpload="!!1" @on-change="upchange"
											@on-success="upsuccess" @on-choose-complete="choosecomplete"
											:showUploadList="setting.showUploadList"
											:sourceType="setting.sourceType"></tn-image-upload>
									</view>
								</tn-form-item>
								<tn-form-item label="检验人" :required="true">
									<tn-input v-model="userinfo.zhanghaouser" disabled />
								</tn-form-item>
							</tn-form>
						</view>
					</block>
				</view>
			</view>

			<bottom-btn @save="save" @submit="submit"></bottom-btn>

			<view class='tn-tabbar-height'></view>

		</view>
	</app-layout>
</template>

<script>
	import locationmixin from '@/libs/mixin/location_mixin.js'
	export default {
		name: 'physicaladd',
		mixins: [locationmixin],
		data() {
			return {
				tztimeshow: false,
				form: {
					mfid: '',
					tid: '',
					tijiantime: '',
					questionnaire: '',
					tijiandd: ''
				},
				rules: {
					tijiantime: [{
						required: true,
						message: '请选择体检时间',
						trigger: 'blur,change'
					}],
					questionnaire: [{
						required: true,
						message: '请拍摄问卷照片',
						trigger: 'blur,change'
					}],

				}

			}
		},
		onLoad(options) {
			let t = this;
			this.form.mfid = options.mfid ? options.mfid : this.form.mfid;
			this.form.tid = options.tid ? options.tid : this.form.tid;
			if (!this.form.tid) {
				uni.showModal({
					title: '提示',
					content: '用户ID不存在，请稍后再试',
					showCancel: false,
					success() {
						t.goBack()
					}
				})
			}
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules)
		},
		watch: {
			photo(nval, oval) {
				this.form.questionnaire = nval
			},

		},
		
		methods: {
			save() {

			},
			submit() {
				let t = this;
				t.form.tijiandd = t.form.address;
				this.$refs.uForm.validate(valid => {
					if (valid) {
						// 验证通过
						console.log('验证通过')
						t.add()
					} else {
						// 验证失败
						console.log('验证失败')
					}
				})
			},
			add(param) {
				let t = this;
				this.$t.message.loading('提交中');
				this.$request({
					url: t.$api.physical.add,
					data: t.form,
					method: 'POST'
				}).then(response => {
					t.$t.message.closeLoading();
					if (response.code === 0) {
						let url = `/discoveryPages/physical/list?mfid=${t.form.mfid}`
						uni.showModal({
							title: '',
							content: response.msg,
							showCancel: false,
							success() {
								uni.redirectTo({
									url: url
								});
							}
						});
					} else {
						uni.showModal({
							title: '',
							content: response.msg,
							showCancel: false,
						});
					}
				}).catch((msg) => {
					t.$t.message.closeLoading();
				});
			},


			tzselect(e) {
				console.log(e)
				this.form.tijiantime = e.date
			},
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		padding: 15rpx;
	}

	.yx {
		padding: 0 20rpx;
		margin: 0 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 20rpx;
		border: 1rpx solid #555555;
		border-radius: 10rpx;
		height: 50rpx;
	}

	.nm {
		width: 150rpx;
		text-align: right;
		padding-right: 10px;
	}

	.ilkresult {
		display: flex;
		flex-direction: column;
		width: 100%;
		align-items: flex-end;
	}

	/* 底部安全边距 start*/
	.tn-tabbar-height {
		min-height: 120rpx;
		height: calc(140rpx + env(safe-area-inset-bottom) / 2);
		height: calc(140rpx + constant(safe-area-inset-bottom));
	}


	.sign {
		width: 100%;
		height: 200rpx;
	}

	.photo {
		width: 100rpx;
		height: 120rpx;
		margin: 10rpx;
	}
</style>